<template>
	<view class="form-content">
		<uni-forms ref="form" :modelValue="formData" :rules="rules">
			<uni-forms-item name="stuId" label="学号">
				<uni-easyinput type="number" v-model="formData.stuId" placeholder="请输入学号" />
			</uni-forms-item>
			<uni-forms-item name="name" label="姓名">
				<uni-easyinput type="text" v-model="formData.name" placeholder="请输入姓名" />
			</uni-forms-item>
			<uni-forms-item name="gender" label="性别">
				<radio-group name="gender" label="性别" v-model="formData.gender">
					<label>
						<radio value="0" /><text>男</text>
					</label>
					<label>
						<radio value="1" /><text>女</text>
					</label>
				</radio-group>
			</uni-forms-item>
			<uni-forms-item name="card" label="身份证号码">
				<uni-easyinput type="text" v-model="formData.card" placeholder="请输入身份证号码" />
			</uni-forms-item>
			<uni-forms-item name="phone" label="手机号">
				<uni-easyinput type="number" v-model="formData.phone" placeholder="请输入手机号" />
			</uni-forms-item>
			<uni-forms-item name="parentName" label="监护人姓名">
				<uni-easyinput type="text" v-model="formData.parentName" placeholder="请输入监护人姓名" />
			</uni-forms-item>
			<uni-forms-item name="parentPhone" label="监护人联系方式">
				<uni-easyinput type="number" v-model="formData.parentPhone" placeholder="请输入监护人联系方式" />
			</uni-forms-item>
			<uni-forms-item name="origin" label="籍贯">
				<uni-easyinput type="text" v-model="formData.origin" placeholder="请输入籍贯" />
			</uni-forms-item>
			<uni-forms-item name="outlook" label="政治面貌">
				<radio-group name="outlook" label="政治面貌" v-model="formData.outlook">
					<label>
						<radio value="0" /><text>群众</text>
					</label>
					<label>
						<radio value="1" /><text>共青团员</text>
					</label>
				</radio-group>
			</uni-forms-item>
			<uni-forms-item name="homeAddress" label="家庭住址">
				<uni-easyinput type="text" v-model="formData.homeAddress" placeholder="请输入家庭住址" />
			</uni-forms-item>
			<view class="btn-content">
				<button size="mini" type="primary" @click="submit">提交</button>
			</view>
		</uni-forms>
	</view>
</template>

<script>
	import {
		addMsg
	} from "@/api/system/msg"

	export default {
		data() {
			return {
				formData: {
					stuId: 0,
					name: null,
					gender: 0,
					card: null,
					phone: null,
					parentName: null,
					parentPhone: null,
					origin: null,
					outlook: 0,
					homeAddress: null,
				},
				rules: {
					stuId: {
						rules: [{
							required: true,
							errorMessage: '学号不能为空'
						}]
					},
					name: {
						rules: [{
							required: true,
							errorMessage: '姓名不能为空'
						}]
					},
					gender: {
						rules: [{
							required: true,
							errorMessage: '性别不能为空'
						}]
					},
					card: {
						rules: [{
								required: true,
								errorMessage: '身份证号码不能为空',
							},
							// {
							// 	minLength: 18,
							// 	maxLength: 18,
							// 	errorMessage: '身份证号码长度为18位'
							// }
						]
					},
					phone: {
						rules: [{
								required: true,
								errorMessage: '电话号码不能为空'
							},
							// {
							// 	minLength: 11,
							// 	maxLength: 11,
							// 	errorMessage: '电话号码长度为11位'
							// }
						]
					},
					parentName: {
						rules: [{
							required: true,
							errorMessage: '监护人姓名不能为空'
						}]
					},
					parentPhone: {
						rules: [{
								required: true,
								errorMessage: '监护人电话号码不能为空'
							},
							// {
							// 	minLength: 11,
							// 	maxLength: 11,
							// 	errorMessage: '电话号码长度为11位'
							// }
						]
					},
					origin: {
						rules: [{
							required: true,
							errorMessage: '籍贯不能为空'
						}]
					},
					outlook: {
						rules: [{
							required: true,
							errorMessage: '政治面貌不能为空'
						}]
					},
					homeAddress: {
						rules: [{
							required: true,
							errorMessage: '家庭住址不能为空'
						}]
					},

				}
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules)
		},
		methods: {
			submit() {
				this.$refs.form.validate().then(res => {
					addMsg(this.formData).then(response => {
						uni.$emit('date', {e: 1})
						this.$modal.msgSuccess("提交成功")
						uni.navigateBack()
					})
				}).catch(err => {
					this.$modal.errorMessage("提交失败");

				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff;

		.form-content {
			margin: 10px;
			padding: 10px;

			.btn-content {
				display: flex;
				justify-content: center
			}
		}
	}
</style>